<template>
  <div class="app-container">

    <div class="card-wrap flex-column justify-end card-padding">

      <div class="card-title-wrap">
        <span>基本信息</span>
        <span></span>
      </div>

      <el-descriptions title="">
        <el-descriptions-item label="客户类型">
          <dict-tag :options="dict.type.customer_type" :value="form.customerTypeCode" />
        </el-descriptions-item>
        <el-descriptions-item label="客户标签">
          {{form.customerLabel|filterNull}}
          <!--                    <dict-tag-->
          <!--                        :options="dict.type.customer_label"-->
          <!--                        :value="form.customerLabelCode"/>-->
        </el-descriptions-item>
        <el-descriptions-item label="客户属性">
          <dict-tag :options="dict.type.customer_property" :value="form.customerPropertyCode" />
        </el-descriptions-item>
        <el-descriptions-item label="客户等级">
          <dict-tag :options="dict.type.customer_level" :value="form.customerLevelCode" />
        </el-descriptions-item>
        <el-descriptions-item label="业务范围">
          <dict-tag :options="dict.type.business_scope" :value="form.businessScopeCode" />
        </el-descriptions-item>
        <el-descriptions-item label="客户名称">{{ form.customerName|filterNull }}</el-descriptions-item>
        <el-descriptions-item label="联系方式">{{ form.customerPhone|filterNull }}</el-descriptions-item>

        <el-descriptions-item v-if="1==form.customerTypeCode" label="客户工作单位">
          {{ form.customerWorkPlace|filterNull }}
        </el-descriptions-item>
        <el-descriptions-item v-if="1==form.customerTypeCode" label="客户住址">{{
                        form.customerAddr|filterNull
                    }}
        </el-descriptions-item>
        <el-descriptions-item v-if="1==form.customerTypeCode" label="客户职业">{{
                        form.customerWork|filterNull
                    }}
        </el-descriptions-item>
        <el-descriptions-item v-if="1==form.customerTypeCode" label="客户职务">
          {{ form.customerWorkDuties|filterNull }}
        </el-descriptions-item>
        <el-descriptions-item v-if="2==form.customerTypeCode" label="主营业务">
          {{ form.customerPrimaryBusiness|filterNull }}
        </el-descriptions-item>
        <el-descriptions-item v-if="2==form.customerTypeCode" label="统一信用代码">
          {{ form.customerUscc|filterNull }}
        </el-descriptions-item>
        <el-descriptions-item v-if="2==form.customerTypeCode" label="经营地址">
          {{ form.customerBusinessAddr|filterNull }}
        </el-descriptions-item>
        <el-descriptions-item v-if="2==form.customerTypeCode" label="法定代表人">
          {{ form.customerResponsibleName|filterNull }}
        </el-descriptions-item>
        <el-descriptions-item label="联系人1">{{ form.primaryContact|filterNull }}</el-descriptions-item>
        <el-descriptions-item label="联系人1联系方式">{{
                        form.primaryContactPhone|filterNull
                    }}
        </el-descriptions-item>
        <el-descriptions-item v-if="2==form.customerTypeCode" label="联系人职务">
          {{ form.primaryContactWorkDuties|filterNull }}
        </el-descriptions-item>
        <el-descriptions-item v-if="1==form.customerTypeCode" label="与客户关系">
          {{ form.primaryContactIdentity|filterNull }}
        </el-descriptions-item>
        <el-descriptions-item label="联系人2">{{ form.secondaryContact|filterNull }}</el-descriptions-item>
        <el-descriptions-item label="联系人2联系方式">{{
                        form.secondaryContactPhone|filterNull
                    }}
        </el-descriptions-item>
        <el-descriptions-item v-if="2==form.customerTypeCode" label="联系人职务">
          {{ form.secondaryContactWorkDuties|filterNull }}
        </el-descriptions-item>

        <el-descriptions-item v-if="1==form.customerTypeCode" label="与客户关系">
          {{ form.secondaryContactIdentity|filterNull }}
        </el-descriptions-item>
        <el-descriptions-item :label="2==form.customerTypeCode?'法人证件类型':'证件类型'">
          <dict-tag :options="dict.type.identity_type" :value="form.identityTypeCode" />
        </el-descriptions-item>
        <el-descriptions-item label="客户类别">
          <dict-tag :options="dict.type.basic_classification_customers" :value="form.customerTypeSelect" />
        </el-descriptions-item>
        <el-descriptions-item :label="2==form.customerTypeCode?'法人证件号码':'证件号码'">{{ form.identityNumber|filterNull }}</el-descriptions-item>
        <!--        <el-descriptions-item label="账户帐号">{{ form.bankAccountName|filterNull }}</el-descriptions-item>-->
        <!--        <el-descriptions-item label="账户开户行">{{ form.bankName|filterNull }}</el-descriptions-item>-->
        <el-descriptions-item label="传真">{{ form.customerMail|filterNull }}</el-descriptions-item>
        <el-descriptions-item label="电子邮箱">{{ form.customerFax|filterNull }}</el-descriptions-item>

        <el-descriptions-item label="证件">
          <div class="flex">
            <ImageCommon disabled v-model="form.identityFrontImg"></ImageCommon>
            <ImageCommon disabled v-model="form.identityBackImg"></ImageCommon>
            <!--            <ImagePreview :src="getUrl(form.identityFrontImg)"></ImagePreview>-->
            <!--            <ImagePreview :src="getUrl(form.identityBackImg)"></ImagePreview>-->
          </div>
        </el-descriptions-item>

        <el-descriptions-item label="驾驶证">
          <div class="flex">
            <ImageCommon disabled v-model="form.driverLicenseFrontImg"></ImageCommon>
            <ImageCommon disabled v-model="form.driverLicenseBackImg"></ImageCommon>
          </div>
        </el-descriptions-item>

        <el-descriptions-item v-if="2==form.customerTypeCode" label="营业执照">
          <div class="flex">
            <ImageCommon disabled v-model="form.businessLicenseFrontImg"></ImageCommon>
            <!--            <ImageCommon disabled :src="form.businessLicenseBackImg"></ImageCommon>-->
            <!--            <ImagePreview :src="getUrl(form.businessLicenseFrontImg)"></ImagePreview>-->
            <!--            <ImagePreview :src="getUrl(form.businessLicenseBackImg)"></ImagePreview>-->
          </div>
        </el-descriptions-item>

        <el-descriptions-item label="附件">
          <div class="flex">
            <ImageCommon disabled v-model="form.annex"></ImageCommon>
            <!--            <FilePreview :fileList="getUrl(form.annex)"></FilePreview>-->
          </div>
        </el-descriptions-item>

      </el-descriptions>

    </div>

    <div class="card-wrap flex justify-end card-padding">
      <el-button @click="cancel">返回</el-button>
      <!--      <el-button :loading="buttonLoading" type="primary" @click="submitForm">保存</el-button>-->
    </div>

  </div>
</template>

<script>


import { customerDetail } from "@/api/memberManage/memberList";

export default {
  name: "memberDetail",
  components: {},
  dicts: ['customer_type', 'business_scope', 'customer_level', 'customer_property', 'customer_source', 'customer_label', 'identity_type', 'basic_classification_customers'],
  data() {
    return {
      buttonLoading: false,
      form: {},
      activeName: 'first'
    };
  },
  watch: {
    '$route': {
      handler(val) {
        console.log('this.$route', this.$route)

        if (val && val.name == this.$options.name) {
          if (this.$route.query && this.$route.query.customerId && !this.$route.query.tabClick) {
            this.getOldData(this.$route.query.customerId)
          }
        }
      },
      immediate: true,
      deep: true
    }
  },
  // mounted() {
  //     if (this.$route.query) {
  //         this.getOldData(this.$route.query.customerId)
  //     }
  // },
  methods: {
    cancel() {
      this.$router.back();
      this.$store.dispatch('tagsView/delView', this.$route);
    },
    getOldData(customerId) {
      customerDetail(customerId).then(res => {
        this.form = res.data
      })
    },
    getUrl(ossid) {
      ossid = String(ossid)
      if (ossid && ossid.indexOf(",") != -1) {
        let split = ossid.split(",");

        let res = this.form.ossVos.filter(item => {
          for (let splitElement of split) {
            if (item.ossId == splitElement) {
              return item
            }
          }

        }).map(item => {
          return item.url
        })
        console.log('aaa', res)
        return res

      } else {
        if (this.form.ossVos && this.form.ossVos.length) {
          return this.form.ossVos.find(item => {
            if (item.ossId == ossid) {
              return item
            }
          })?.url
        }
      }
    },
  }
};
</script>


<style lang="scss" scoped>
</style>
